<template>
	<view class="">
		<view class="header-area">
			<commonTab :nowCurrent="3"></commonTab>
			<navigator url="/yixu/pages/super_card/detail" hover-class="none" class="edit-data-area">

				<view class="show-user-information-area u-margin-30 u-margin-top-50 u-border-radius-10 u-padding-30">
					<!--				<navigator v-if="myBusinessCardInformation.status != 0" url="/yixu/pages/network_square/my_business_card/edit" hover-class="none" class="edit-data-area">-->
					<!--					<u-icon name="edit-pen" color="#FFFFFF" size="24" label="编辑" label-size="22" label-color="#FFFFFF"></u-icon>-->
					<!--				</navigator>-->
					<view class="u-flex u-margin-bottom-40">
						<u-avatar :src="myBusinessCardInformation.avatar" :size="94"></u-avatar>
						<view class="u-margin-left-20">
							<text
								class="xxl u-font-weight-500 pangmenzhengdao-font">{{ myBusinessCardInformation.name || '' }}</text>
							<view class="nr u-color-666666 u-margin-top-5 deyihei-font">
								{{ myBusinessCardInformation.tel || '待完善' }}
							</view>
						</view>
					</view>
					<image v-if="myBusinessCardInformation.status == 0" class="audit-status-icon"
						src="https://resource.lanbaozixun.com/uploads/images/20241009224833920243053.png"
						mode="widthFix"></image>
					<image v-else-if="myBusinessCardInformation.status == 2" class="audit-status-icon"
						src="https://resource.lanbaozixun.com/uploads/images/20241009225051dcc038162.png"
						mode="widthFix"></image>
					<view class="u-margin-top-40 u-flex-col u-color-333333 pangmenzhengdao-font">
						<u-icon :label="`公司: ${myBusinessCardInformation.company_name||'待完善'}`" label-size="28"
							size="30"
							name="https://resource.lanbaozixun.com/uploads/images/202410091145252bd5e4474.png"></u-icon>
						<u-icon :label="`地址: ${myBusinessCardInformation.company_site||'待完善'}`" label-size="28"
							size="30" name="https://resource.lanbaozixun.com/uploads/images/202410091145255225b0246.png"
							class="u-margin-top-15"></u-icon>
					</view>
					<view class="fill-information-area u-text-center" v-if="myBusinessCardInformation.status == -1">
						<navigator url="/yixu/pages/network_square/my_business_card/edit" hover-class="none"
							class="fill-information-btn">
							<u-icon size="30"
								name="https://resource.lanbaozixun.com/uploads/images/20241007230529df68b8627.png"></u-icon>
							<text class="white nr u-padding-left-10 pangmenzhengdao-font">完善信息</text>
						</navigator>
					</view>
				</view>
			</navigator>
			<view class="bg-white u-border-radius-10 u-padding-30 u-margin-right-30 u-margin-left-30"
				v-if="myBusinessCardInformation.status == -1">
				<view class="u-font-weight-500 md pangmenzhengdao-font">发布名片，获取精准客户线索和同行人脉</view>
				<view class="xs u-color-666666 u-margin-top-20">
					1.可以与其他同行打招呼直接平台聊天<br />
					2.甩单需求、合作需求都可以在人脉广场中展示<br />
					3.接收同城的同行甩单
				</view>
			</view>

			<view v-if="myBusinessCardInformation.status != -1"
				class="bg-white u-border-radius-10 u-padding-30 u-margin-right-30 u-margin-top-30 u-margin-left-30">
				<view class="u-font-weight-500 md u-flex u-row-between">
					<text class="pangmenzhengdao-font">在人脉广场中展示联系方式</text>
					<u-switch v-model="myBusinessCardInformation.show_status == 1?true:false" :size="30"
						@change="shiftShowStatus(myBusinessCardInformation.show_status)"></u-switch>
				</view>
				<view class="xs u-color-666666 u-margin-top-20">
					关闭后您的微信和联系方式不会在人脉广场中展示，同行和客户联系只能通过打招呼的方式与您联系
				</view>
			</view>
 

			<view v-if="myBusinessCardInformation.status != -1"
				class="bg-white u-margin-right-30 u-margin-top-30 u-margin-left-30 u-border-radius-10">
				<myPublishData></myPublishData>
			</view>
		<common-tabbar></common-tabbar>
		<xy-loading v-if="loadingShowStatus"></xy-loading>
	</view>
	</view>
</template>

<script>
	import {
		queryBasicInformation
	} from '@/api/userBusinessCard'
	import {
		sendPostRequest
	} from '@/api/networkSquare'
	import commonTab from '@/yixu/pages/network_square/components/common_tab.vue'
	import myPublishData from '@/yixu/pages/network_square/my_business_card/components/my_publish_data.vue'

	export default {
		components: {
			commonTab,
			myPublishData
		},
		data() {
			return {
				loadingShowStatus: true,
				myBusinessCardInformation: []
			}
		},
		onLoad() {
			this.queryBasicInformationFun()
		},
		methods: {
			async queryBasicInformationFun() {
				let _this = this;
				let d = await queryBasicInformation();
				if (d.code == 1) this.myBusinessCardInformation = d.data;
				_this.loadingShowStatus = false;
			},
			async shiftShowStatus(s) {
				this.myBusinessCardInformation.show_status = s == 1 ? 0 : 1;

				let d = await sendPostRequest('shiftShowStatus', {
					'show_status': this.myBusinessCardInformation.show_status
				})
				uni.hideLoading()
				this.$u.toast(this.myBusinessCardInformation.show_status == 1 ? '名片已开启展示' : '名片已隐藏成')
			},
		}
	}
</script>

<style lang="scss">
	page {
		min-height: 100vh;
		background: linear-gradient(to top, rgba(242, 242, 242, 1) 60%, #FFFFFF 100%);

		.show-user-information-area {
			position: relative;
			background: url('https://resource.lanbaozixun.com/uploads/images/20241007224752ea8292514.png') no-repeat 100%;

			.edit-data-area {
				top: 0;
				right: 0;
				padding: 2rpx 10rpx;
				position: absolute;
				background: #437EEA;
				border-radius: 0 10rpx 0 10rpx;
			}
		}
		
		.bg-F2F2F2{
			background: #F2F2F2;
		}

		.fill-information-area {
			margin-top: 100rpx;

			.fill-information-btn {
				padding: 18rpx 80rpx;
				display: inline-flex;
				border-radius: 100rpx;
				background: linear-gradient(180deg, #6BB2FF 0%, #437EEA 100%);
			}
		}

		.audit-status-icon {
			top: 50%;
			right: 5%;
			width: 150rpx;
			position: absolute;
			transform: translateY(-50%);
		}
	}
</style>

